<template>
  <div class="point">
    <div class="list_title">
      <div class="text">加分表现({{ tableData.length || 0 }}项)</div>
    </div>
    <div class="point-table">
      <vxe-table border size="small" stripe highlight-hover-row align="center" resizable :data="tableData">
        <vxe-column type="seq" width="60" title="序号" fixed="left"></vxe-column>
        <vxe-column field="bonusName" title="加分项名称" fixed="left" min-width="130"></vxe-column>
        <vxe-column field="score" title="加分" width="130"></vxe-column>
        <vxe-column field="tagTwo" title="加分项类别" min-width="130"></vxe-column>
        <vxe-column field="tageThree" title="加分项级别" min-width="130"></vxe-column>
        <vxe-column field="passTime" title="加分项时间" width="130"></vxe-column>
        <vxe-column field="enclosureList" title="证明材料" min-width="130">
          <template #default="{ row }">
            <div v-for="(item, index) in row.enclosureList" :key="index">
              <span class="color_file" @click="downFileData(item)">{{ item.name }}</span>
            </div>
            <div v-for="(item, index) in row.albumList" :key="index">
              <span class="color_file" @click="downFileData(item)">{{ item.name }}</span>
            </div>
          </template>
        </vxe-column>
        <template #empty>
          <div class="table_no_data">
            <empty></empty>
          </div>
        </template>
      </vxe-table>
    </div>
  </div>
</template>

<script>
import { getAddSubPoints } from '@apis/api-intelligent.js'
import { downloadFile } from '@api/api.js'
export default {
  name: 'FilePoint',
  components: {},
  props: {
    dataObj: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      allAlign: 'center',
      tableData: [],
      timeChoose: {},
    }
  },
  computed: {},
  watch: {
    dataObj: {
      handler(news) {
        if (news.year && news.userId) {
          this.pageInit()
        }
      },
      deep: true,
    },
  },
  created() {},

  mounted() {
    if (this.dataObj.userId && this.dataObj.year) {
      this.pageInit()
    }
  },
  methods: {
    async pageInit() {
      const { data } = await getAddSubPoints({
        currentPage: 1,
        pageSize: 1000,
        param: {
          pageNum: 1,
          pageSize: 1000,
          quarter: this.dataObj.quarter,
          tenantId: localStorage.pskh_tenantId,
          userId: this.dataObj.userId,
          year: this.dataObj.year,
        },
      })
      this.tableData = data.content
    },
    // 下载
    downFileData(fileItem) {
      const req = `?fileName=${encodeURIComponent(fileItem.name)}&filePath=${fileItem.sourcePath}`
      const link = document.createElement('a')
      link.target = 'targetName'
      link.href = downloadFile(req)
      link.click()
      link.remove()
    },
  },
}
</script>

<style lang="scss" scoped>
@import './title.scss';

.point {
  margin-top: 20px;
  /deep/.vxe-table--render-default .vxe-table--body-wrapper {
    background-color: transparent;
  }
  /deep/.vxe-header--column {
    font-weight: normal;
  }

  .color_file {
    cursor: pointer;
    color: #136cc9;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 28px;
    text-align: left;

    &:hover {
      color: #3863a3;
      font-weight: 600;
    }
  }
}
</style>
